import { Card, Form, Input, InputNumber, Radio } from 'antd'
import { FC, useEffect } from 'react'

export interface IData {
  id: number
  enterprise_name: string
  key: string
  value: string
}

// export interface FireProtectionFacility {
//   type: string
// }

export enum IType {
  UNKNOWN,
  VIEW,
  EDIT,
}

export interface IProps {
  data: IData
  disabled: boolean
  onConfirm: (value) => void
}

export enum ISize {
  UNKNOWN,
  SMALL, // 小微企业
  MIDDLE, // 中小企业
  LARGE, // 大型企业
  INNOVATIVE, //创新型企业
  INCUBATING, //孵化企业
}

const Index: FC<IProps> = (_) => {
  const { disabled, data, onConfirm } = _
  const [form] = Form.useForm()

  useEffect(() => {
    if (data) {
      const { id, value } = data
      const parseValue = JSON.parse(value || '{}')

      form.setFieldsValue({
        id,
        ...parseValue,
      })
    }
  }, [data])

  return (
    <Card>
      <Form form={form} disabled={disabled} name="creatorForm" onFinish={onConfirm}>
        {/* <Form.Item label="企业名称">
          {data.enterprise_name}
        </Form.Item> */}
        <Form.Item label="ID" name="id">
          <Input disabled></Input>
        </Form.Item>
        <Form.Item label="企业规模" name="enterprise_size">
          <Radio.Group>
            <Radio value={ISize.SMALL}>小微企业</Radio>
            <Radio value={ISize.MIDDLE}>中小企业</Radio>
            <Radio value={ISize.LARGE}>大型企业</Radio>
            <Radio value={ISize.INNOVATIVE}>创新型企业</Radio>
            <Radio value={ISize.INCUBATING}>孵化企业</Radio>
          </Radio.Group>
        </Form.Item>
        <Form.Item label="面积" name="enterprise_area">
          <InputNumber style={{ width: 200 }} placeholder="请输入面积" addonAfter="平方米"></InputNumber>
        </Form.Item>
      </Form>
    </Card>
  )
}

export default Index
